<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		
		<style type="text/css">
			*{
				margin: 0;
				padding: 0;
			}
			ul{
				list-style: none;
				width: 800px;
				height: 50px;
				margin: 0 auto;
				margin-top: 100px;
				background-color: red;
			}
			ul li{
				 float: left;
				 width: 100px;
				 height: 50px;
				 line-height: 50px;
				 text-align: center;
				 background-color: #ccc;
			}
			ul li:nth-child(4){
				background-color: aqua;
				position: relative;
			}
			ul li:nth-child(4) img{
				
				/* 相对定位的弊端  
				 相对定位不会脱离标准流 会占用一份空间
				 不利于布局页面
				 
				 */
			/* 	position: relative;
				left: -25px;
				top: -20px; */
				
				/* 
				 子绝父相
				 子元素用绝对定位 父元素使用相对定位
				 
				 */
				position: absolute;
				left: 50px;
				top: -5px;
			}
		</style>
	</head>
	<body>
		
		<ul>
			<li>服装</li>
			<li>美妆</li>
			<li>京东超市</li>
			<li >全球购
			<img src="../基础/百度/images/response.png" width="15"  height="15" alt="">
			</li>
			<li>闪购</li>
			<li>团购</li>
			<li>拍卖</li>
			<li>金融</li>
		</ul>
		
		
		
		
	</body>
</html>